<!-- Uniapp + TypeScript 相关配置文档 -->
<!-- https://www.jianshu.com/p/b01b5158cfe0 -->

<!-- vue-cli创建uniapp项目报错[ app.json 文件内容错误] app.json: app.json 未找到 -->
<!-- https://blog.csdn.net/weixin_46016926/article/details/119334939 -->



<!-- https://blog.csdn.net/sllailcp/article/details/102542796/ -->
<!-- vue-property-decorator的简单介绍 -->

<template>
	<view class="content">
		<headers title="YUANYUE" :show_logo="true" :show_bol="true" :show_title="false" backgroundColor="#fff">
		</headers>
		<view class="aa" :style="{'padding-top': bar_Height + 45 + 'px','background':  '#ffffff'}"></view>
		<tabbar navActive='0'></tabbar>
		<image class="indexImg1" mode="" src='/static/images/index1.png'></image>
		<view class="link-wrap">
			<view class="item" @click="openLoginFun">
				<image class="bg" mode="" src='/static/images/index2.png'></image>
				<view class="item-con">
					<image class="icon" mode="" src='/static/images/index3.png'></image>
					<view class="cn">活动报名</view>
					<view class="en">EVENT REGISTRATION</view>
				</view>
			</view>
			<view class="item" @click="openLoginFun2">
				<image class="bg" mode="" src='/static/images/index4.png'></image>
				<view class="item-con">
					<image class="icon" mode="" src='/static/images/index5.png'></image>
					<view class="cn">报名记录</view>
					<view class="en">REGISTRATION RECORD</view>
				</view>
			</view>
		</view>
		<view class="isLogin" v-if="isLogin">
			<view class="isLogin-con">
				<image class="closes" @click="closeLoginFun" mode="" src='/static/images/close.png'></image>
				<view class="login-text">
					<view class="cn">请先去登录</view>
					<view class="en">PLEASE LOG IN FIRST</view>
				</view>
				<view class="button-wrap">
					<view class="button" @click="closeLoginFun">取消</view>
					<view class="button goLogin" @click="goLoginFun">去登录</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang='ts'>
	import {
		Component,
		Vue,
		Prop,
		Watch,
		Emit,
		Ref,
		Mixins
	} from 'vue-property-decorator';

	import {
		IGlobalData
	} from '../../utils/interfaces';


	import headers from "../../components/headers.vue";
	import tabbar from "../../components/tabbar.vue";

	import commonFnMixins from "../../utils/mixins";

	const mdCode = require('../../utils/md5.js');
	const desCode = require('../../utils/aesUtil.js');
	const api_js = require("../../utils/api.js");
	var app = getApp();

	// 一定要加 @Component 装饰器，否则小程序生命周期会报错失效
	@Component({
		name: 'index',
		mixins: [commonFnMixins],
		components: {
			headers,
			tabbar
		},
	})


	// export default class callback extends Mixins(commonFnMixins){
	//     mounted(){
	//         this.sayHello()
	//     }
	// }


	export default class App extends Vue {
		// 初始化数据
		// 公共public，私有private与受保护protected的修饰符
		// 一般来说，在TypeScript里，成员都默认为public。
		title: string = 'Hello';
		imgSrc: string = '';
		videoSrc: string = '';

		currentTabIndex: number = 0;
		bar_Height: number = wx.getSystemInfoSync().statusBarHeight;
		// userInfo: object = {
		// 	a: 1
		// };

		userInfo: any = {
			a: 1
		};
		test: number = 111;

		hasUserInfo: boolean = false;
		canIUse: boolean = wx.canIUse('button.open-type.getUserInfo');
		isIphoneX_: boolean = false;
		// 是否登录
		isLogin: boolean = false;
		globalData: IGlobalData = {};

		@Watch('userInfo', {
			immediate: true,
			deep: true
		})
		onChildChanged11(newValue: number, oldValue: number) {
			console.log(newValue, "watch - newValue");
			console.log(oldValue, "watch - oldValue");
		}

		@Watch('test', {
			immediate: true,
			deep: true
		})
		onChildChanged22(newValue: number, oldValue: number) {
			console.log(newValue, "watch - test -- newValue");
			console.log(oldValue, "watch - test -- oldValue");
		}
		created() {
					console.log(this.selected, "selected")
		}


		onLoad() {
			uni.hideTabBar({
				animation: false
			});
			this.globalData = app.globalData as IGlobalData;
			this.isIphoneX_ = this.globalData.isIphoneX
			this.globalData.HeadPortrait = "https://imgm.gmw.cn/attachement/jpg/site215/20210917/4159435567306654605.jpg";
			console.log(this.globalData, "app");
			this.userInfo.a = 100;
			this.test = 99;
			// console.log(this.selected, "selected")
			// this.sayHello();
		};



		openLoginFun() {
			if (this.globalData.LoginStatus == 1) {
				this.isLogin = true;
			} else {
				this.closeLoginFun();
				uni.navigateTo({
					url: '../apply/index'
				})
			}
		};

		openLoginFun2() {
			if (this.globalData.LoginStatus == 1) {
				this.isLogin = true;
			} else {
				this.closeLoginFun();
				uni.navigateTo({
					url: '../applyList/index'
				})
			}
		};

		closeLoginFun() {
			this.isLogin = false;
		};

		goLoginFun() {
			this.closeLoginFun();
			uni.navigateTo({
				url: '../login/index'
			})
		};
	}
</script>



<style lang="scss" scoped>
	@import 'index.scss';
</style>
